<script setup lang="jsx">
  import {watch,inject,ref,reactive,computed} from 'vue'
  import customerFee from '@/api/finance/customerFee'
  import customerBill from '@/api/finance/customerBill'
  import BatchActionModal from "@cps/actions/batchActionModal.vue";
  import CustomerFeeList from "@/views/finance/customerBill/components/customerfee.vue";
  import ButtonGroup from "@cps/actions/buttonGroup.vue";
  import AddModal from "@cps/actions/addModal.vue";
  import {Message} from '@arco-design/web-vue'
  import dictHelp from "@/utils/dicthelp.js";
  const addModalRef = ref()
  const crudRef = ref()
  const batch = ref({visible:false,})
  const record = inject('record')
  const setFoot = inject('setFoot')
  const refreshRecode = inject('refreshRecode')
  const batchActionRef = ref()
  const totalMoney = ref(0)
  const buttonGroups = ref([
        // {title:'导入',displayDataIndex:"id",},
        // {title:'费用修改',displayDataIndex:"id",},
        {title:'删除',displayDataIndex:"id",},
      ])
  const selected = computed(()=>crudRef.value?.selecteds)
  const selecteFee = ref([])
  const customerFeeList = ref()
  let options = reactive({
      id: 'customer_fee',
      pk: 'id',
      showTools:false,
      autoRequest: false,
      isDbClickEdit: true,
      api: customerFee.getList,
      rowSelection: {
        showCheckedAll: true
      },
      beforeRequest:(param)=>{
        param.bill_id = record.value.id
        param.pageSize = 99999
      }
    })
  watch(record,(value)=>{
    if(value.id != undefined){
      console.log('刷新账单流水列表--'+record.value.id)
      crudRef.value.requestData()
    }
  })
  watch(selected,(value)=>{
    if(value.length>0 && selected.value.length > 0){
        let total = 0
        let data = crudRef.value.getTableData()
        let check = []
        let notcheck = []
        selecteFee.value = []
        for(let i=0;i<data.length;i++){
          if(selected.value.includes(data[i].id)){
            if(data[i].statement_fee_id > 0){
              notcheck.push(data[i].id)
              Message.info('已核销的费用选中无效')
              continue;
            }
            check.push(data[i].id)
            total +=  data[i].amount - 0
            selecteFee.value.push(data[i].id)
          }
        }
        setFoot([{label:'费用金额',value:total}])
        totalMoney.value = total
        if(notcheck.length>0){
          crudRef.value.selecteds = check
        }
        buttonGroups.value = [
        // {title:'导入',displayDataIndex:"id",},
        // {title:'费用修改',displayDataIndex:"id",},
        {title:'删除',displayDataIndex:"id",api:customerFee.billOut,auth:['finance:customerFee:bill'],
          form:{
            submited:function(data){
                console.log('列表核销回调')
                refreshRecode()
              },
              form:{
                bill_id:record.value.id,
              },
          }
        },
      ]
    }else{
      setFoot([])
    }
  }) 
  
const columns = reactive([
  {title: '业务时间', dataIndex: 'business_at'},
  {title: '运单号', dataIndex: 'invoices.shipment_no',search:true},
  {title: '客户单号', dataIndex: 'invoices.client_reference',search:true},
  {title: '服务', dataIndex: 'invoices.service.name',dict:dictHelp.service, virtualListProps:{},},
  {title: '费用类型', dataIndex: 'fee_type.id', formType: "select",
    dict: {
        url: 'finance/feeType/list',
        props: {label: 'fee_name', value: 'id'} ,
        params: {select: 'id,fee_name'},
        translation: true,
      },
  search:true},
  {title: '单位', dataIndex: 'unit',formType: "select",
  dict: {
      data: [
        { label: "KG", value: 1 },
        { label: "立方", value: 2 },
        { label: "票", value: 3},
        ],
      translation: true,
    },},
  {title: '费用', dataIndex: 'amount',},
  {title: '核销', dataIndex: 'statement_fee_id',},
]);
const openCustomerAddPage = () => {
  customerFeeList.value.open()
}
const writeOffPass = async () =>{
  if(selected.value.length == 0){
    Message.error('选择要核销的流水')
    return
  }
  addModalRef.value.open(reactive([
      {
        title: "账号",
        dataIndex: "account_id",
        formType: "select",
        addDefaultValue:record.value.account_id,
        disabled:true,
        rules: {
          required: true,
          message: "请选择账号"
        },
        dict: {
          url: 'finance/financialAccount/list',
          props: {label: 'name', value: 'id'} ,
          params: {select: 'id,name',id:record.value.account_id,currency:record.value.currency},
        }, 
      },
      {
        title: "核销金额",
        disabled:true,
        dataIndex: "amount",
        addDefaultValue:totalMoney.value,
        formType: "input",
        rules: {
          required: true,
          message: "请填写金额"
        },
      },
      {
        title: "备注",
        formType: "textarea",
        dataIndex: "remark",
      },
      {
        title: "id",
        formType: "input",
        dataIndex: "id",
        addDefaultValue:record.value.id,
        addDisplay:false,
      },
      {
        title: "fees",
        formType: "input",
        dataIndex: "fees",
        addDefaultValue:selecteFee.value,
        addDisplay:false,
      },
      {
        title: "deduction",
        formType: "input",
        dataIndex: "deduction",
        addDefaultValue:0,
        addDisplay:false,
      },
    ]) , {
         viewType: 'modal',
      }, customerBill.writeOffPass,'核销',function name() {
        refreshRecode()
      })
}
</script>

<template>
  <a-grid-item :span="24">
    <add-modal ref="addModalRef"></add-modal>
    <a-collapse :default-active-key="['1']" class="g-collapse-no-p">
      <a-collapse-item header="账单流水" key="1">
        <customer-fee-list ref="customerFeeList" />
          <ma-crud :options="options" :columns="columns" ref="crudRef" class="customer-bill-customer-fee-list">
            <template #beforeTable>
              <div style="margin-top: 20px;display:flex">
              <a-button @click="openCustomerAddPage()" style="margin: 0 10px 0 0;" size="small" type="primary" status="success" v-auth="['finance:customerFee:bill']">
                添加
              </a-button>
              <a-button @click="writeOffPass()" size="small" style="margin: 0 10px 0 0;" type="primary" v-auth="['finance:customerBill:writeOffPass']">
                核销
              </a-button>
              <button-group :button-groups="buttonGroups" :crud-ref="crudRef" :selected="selected" />
            </div>
            </template>
            <template #statement_fee_id="{ record }">
              <p v-if="record.statement_fee_id > 0">已核销</p>
              <p v-else></p>
            </template>
          </ma-crud>
          <batch-action-modal v-model="batch.visible"
          :crud-ref="crudRef"
          :selected="selected"
          ref="batchActionRef"
          ></batch-action-modal>
      </a-collapse-item>
    </a-collapse>
  </a-grid-item>
</template>
<style>
.customer-bill-customer-fee-list ._crud-footer{
  display:none;
}

</style>
